import {
  selectCourseFileList
} from '@/api/manage.js'
import WebOfficer from '@/components/WebOfficer/index.vue'
import CourseChapter from '@/components/Course/CourseChapter/index.vue'
export default {
  components: {
    CourseChapter,
    WebOfficer
  },
  data() {
    return {
      // editerOtions: {
      //   info: null
      // },
      tableParam: {
        courseId: this.$route.query.courseId || null,
        courseCatalogId: this.$route.query.courseCatalogId || null
      },
      WebOfficers: {
        filepath: ''
      },
      WebOfficerConfigs: {
        Titlebar: true,
        IsNotCopy: false,
        Menubar: true,
        Toolbars: true
      },
      optionsNoter: {
        disabled: true
      },
      keys: {
        WebOfficer: new Date().getTime() + '' + Math.random(),
        VideoUplayer: new Date().getTime() + '' + Math.random(),
        Noter: new Date().getTime() + '' + Math.random()
      }
    }
  },
  created() {
    if (this.tableParam.courseCatalogId) {
      this.selectCourseFileList()
    } else {
      // console.log(this.$route.query)
    }
  },
  computed: {
    courseCatalogId() {
      return this.$store.getters.courseCatalogId
    }
  },
  watch: {
    courseCatalogId() {
      // console.log(this.courseCatalogId)
      // console.log(this.$store.getters.courseCatalogId)
      // console.log(this.tableParam.courseCatalogId)
      this.tableParam.courseCatalogId = this.courseCatalogId
      this.keys = {
        WebOfficer: new Date().getTime() + '' + Math.random(),
        VideoUplayer: new Date().getTime() + '' + Math.random(),
        Noter: new Date().getTime() + '' + Math.random()
      }
    },
    $route: {
      handler() {
        this.tableParam.courseId = this.$route.query.courseId
        this.tableParam.courseCatalogId = this.$route.query.courseCatalogId
      },
      deep: true
    },
    tableParam: {
      handler() {
        this.selectCourseFileList()
      },
      deep: true
    }
  },
  methods: {
    selectCourseFileList() {
      selectCourseFileList(this.tableParam).then(response => {
        // console.log(response.data.length)
        for (var i = 0; i < response.data.length; i++) {
          // console.log(response.data)
          if (response.data[i].courseFileSuffix.search(/ppt/) > -1) {
            // console.log('ppt')
            // console.info(response.data[i].courseFilePath)
            // this.$store.dispatch('WebOffice/setFile', response.data[i].courseFilePath)
            this.$store.dispatch('course/courseWordPath', response.data[i].courseFilePath).then(result => {
              // this.WebOfficers.filepath = response.data[i].courseFilePath
              // console.log(this.$store.getters.courseWordPath)
              this.keys.WebOfficer = new Date().getTime()
            })
          } else if (response.data[i].courseFileSuffix.search(/doc/) > -1) {
            // console.log('doc')
            // console.info(response.data[i].courseFilePath)
            this.$store.dispatch('course/courseWordPath', response.data[i].courseFilePath).then(result => {
              // this.WebOfficers.filepath = response.data[i].courseFilePath
              // console.log(this.$store.getters.courseWordPath)
              this.keys.WebOfficer = new Date().getTime()
            })
          } else if (response.data[i].courseFileSuffix.search(/mp4/) > -1) {
            // console.log('mp4')
            this.$store.dispatch('course/courseVideoPath', response.data[i].courseFilePath).then(result => {
              // this.WebOfficers.filepath = response.data[i].courseFilePath
              // console.log(this.$store.getters.courseVideoPath)
              this.keys.VideoUplayer = new Date().getTime()
            })
          } else {
            this.WebOfficers.filepath = ''
          }
        }
        // console.log(this.WebOfficers.filepath)
      })
    },
    backChapter(data) {
      // console.log(data)
    }
  }
}
